<div class="el-time-picker" ng-class="{'is-active': showPanel}">
  <!-- 输入框 -->
  <div class="el-date-editor el-input el-input--prefix el-input--suffix el-date-editor--time-select"
    ng-click="togglePanel()" ng-class="[ size ? 'el-input--' + size : '' ]">
    <input class="el-input__inner" placeholder="{{placeholder}}" ng-model="ngModel" readonly>
    <span class="el-input__prefix"><i class="el-input__icon el-icon-time"></i></span>
  </div>

  <!-- 下拉面板 -->
  <div class="el-time-panel el-popper" style="transform-origin: center top; z-index: 2678;" ng-if="showPanel">
    <div class="el-time-panel__content has-seconds">
      <div class="el-time-spinner has-seconds">
        <div class="el-time-spinner__wrapper el-scrollbar">
          <div class="el-scrollbar__wrap" style="max-height: inherit; margin-bottom: -15px; margin-right: -15px;" ng-mousemove="onMouseenter($event)">
            <ul class="el-scrollbar__view el-time-spinner__list">
              <li ng-repeat="h in hours" ng-class="{'active': h === selectedHour}" class="el-time-spinner__item"
                ng-click="selectHour($event,h)">{{h |
                numberFixedLen:2}}</li>
            </ul>
          </div>
          <!-- <div class="el-scrollbar__bar is-horizontal">
            <div class="el-scrollbar__thumb" style="transform: translateX(0%);"></div>
          </div>
          <div class="el-scrollbar__bar is-vertical">
            <div class="el-scrollbar__thumb" style="height: 20.1485%; transform: translateY(387.368%);"></div>
          </div> -->
        </div>
        <div class="el-time-spinner__wrapper el-scrollbar">
          <div class="el-scrollbar__wrap" style="max-height: inherit; margin-bottom: -15px; margin-right: -15px;" ng-mousemove="onMouseenter($event)">
            <ul class="el-scrollbar__view el-time-spinner__list">
              <li ng-repeat="m in minutes" ng-class="{'active': m === selectedMinute}" class="el-time-spinner__item"
                ng-click="selectMinute($event,m)">{{m |
                numberFixedLen:2}}</li>
            </ul>
          </div>
          <!-- <div class="el-scrollbar__bar is-horizontal">
            <div class="el-scrollbar__thumb" style="transform: translateX(0%);"></div>
          </div>
          <div class="el-scrollbar__bar is-vertical">
            <div class="el-scrollbar__thumb" style="height: 9.06921%; transform: translateY(842.105%);"></div>
          </div> -->
        </div>
        <div class="el-time-spinner__wrapper el-scrollbar">
          <div class="el-scrollbar__wrap" style="max-height: inherit; margin-bottom: -15px; margin-right: -15px;" ng-mousemove="onMouseenter($event)">
            <ul class="el-scrollbar__view el-time-spinner__list">
              <li ng-repeat="s in seconds" ng-class="{'active': s === selectedSecond}" class="el-time-spinner__item"
                ng-click="selectSecond($event,s)">{{s |
                numberFixedLen:2}}</li>
            </ul>
          </div>
          <!-- <div class="el-scrollbar__bar is-horizontal">
            <div class="el-scrollbar__thumb" style="transform: translateX(0%);"></div>
          </div>
          <div class="el-scrollbar__bar is-vertical">
            <div class="el-scrollbar__thumb" style="height: 9.06921%; transform: translateY(0%);"></div>
          </div> -->
        </div>
        <!---->
      </div>
    </div>
    <div class="el-time-panel__footer"><button type="button" class="el-time-panel__btn cancel" ng-click="cancel()">取消</button><button
        type="button" class="el-time-panel__btn confirm" ng-click="confirm()">确定</button></div>
    <div x-arrow="" class="popper__arrow" style="left: 35px;"></div>
  </div>
</div>